<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>安全库存配置单查询</title>

    <style>
        table tr th,td{
            border: 1px solid black;
            text-align: center;
        }
        table{
            border: 1px;
            cell-padding:0;
            cell-spacing:0;
            width: 80%;
            margin-top: 20px;
        }
        table thead{
            background-color:#b3d7ff ;
        }
    </style>

    <link rel="stylesheet" href="../css/pintuer.css">
    <link rel="stylesheet" href="../css/admin.css">
    <link rel="stylesheet" href="../css/bootstrap.css">

    <script src="../js/jquery-3.4.1.min.js"></script>
    <script src="../js/bootstrap-table1.15.3.js"></script>
    <script src="../js/bootstrap-table-zh-CN.min.js"></script>
    <script src="../js/popper.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>

</head>

<script>
    function initQueryConfigurationList() {
        $('#queryConfigurationListTableInfo').bootstrapTable({
            method:'post',
            contentType:'application/json',
            url:'/sCell/queryConfigurationAll.action',
            striped:true,
            pageNumber:1,
            pagination:true,
            sidePagination:'server',
            pageSize:3,
            pageList:[1,3,5,6,10],
            queryParams:function (pares) {
                return{
                    pageNum:(pares.offset/pares.limit)+1,
                    pageSize:pares.limit,
                }
            },
            columns:[
                {title:"配置单编号",field:"storeId",align:"center",formatter:function (value,row,index) {
                        return "<a href='#' onclick='updateSCell1("+JSON.stringify(row)+")' data-toggle='modal' data-target='#queryConfigurationListModal'>"+value+"</a>"
                    }},
                {title: "产品编号",field: "productId",align: "center"},
                {title: "产品名称",field: "productName",align: "center"},
                {title: "配置状态",field: "t",align: "center",formatter:function () {
                        return "执行";
                    }},
                {title: "复核状态",field: "checkTag",align: "center",formatter:function (value,row,index) {
                        if(value=='T001-0'){
                            var span='<span style="color: red">等待复核</span>';
                            return span;
                        }else if(value=='T001-1'){
                            var span='<span style="color: greenyellow">复核通过</span>';
                            return span;
                        }
                    }}
            ]
        })
    }

    $(function () {
        initQueryConfigurationList();
    })

    //把列表中的值，拿到模态框中
    function updateSCell1(rows) {

        $('#tbodyId').empty();

        $('#storeId').text(rows.storeId)
        $('#productName').text(rows.productName);
        $('#productId').text(rows.productId);
        $('#minAmount').text(rows.minAmount);
        $('#maxAmount').text(rows.maxAmount);
        $('#checker').text(rows.register);
        $('#config').text(rows.config);
        $('#checkTime').text(rows.registerTime);

        //表格
        $('#tbodyId').empty();
        var trObj=$('#tbodyId').append($('<tr>'));
        trObj.append($('<td>').text(1));
        trObj.append($('<td>').text("成品库"));
        trObj.append($('<td id="kindId">').text(rows.firstKindId+"-"+rows.secondKindId+"-"+rows.thirdKindId));
        trObj.append($('<td id="kindName">').text(rows.firstKindName+"-"+rows.secondKindName+"-"+rows.thirdKindName));
        trObj.append($('<td>').text(rows.maxCapacityAmount));


    }
</script>

<body bgcolor="#f5f5f5">

<div class="container-fluid">
    <div style="width: 100%;margin: 0px;padding: 0px;">
        <table id="queryConfigurationListTableInfo" class="table table-bordered table-hover table-striped table-condensed">

        </table>
    </div>
</div>

<!--模态框-->
<!--modal fade-->
<div class="modal  fade" id="queryConfigurationListModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width: 90%">
        <div class="modal-content" style="border: 1px solid black;">
            <div class="modal-header">
                <div class="container">
                    <div class="row">
                        <div class="col-7" style="text-align: right">
                            <h5 class="modal-title" id="info" >
                                配置单信息
                            </h5>
                        </div>
                        <div class="col-4" style="position: absolute;right: 30px">
                        </div>
                    </div>
                </div>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="margin-right: 0px"></button>
            </div>
            <div class="modal-body">
                    <div class="container">
                        <div class="row">
                            <div class="col-2" style="text-align:right">
                                产品名称：
                            </div>
                            <div class="col-4">
                                <span id="productName"></span>
                            </div>
                            <div class="col-2" style="text-align:right">
                                产品编号：
                            </div>
                            <div class="col-4">
                                <span id="productId"></span>
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-2" style="text-align: right">
                                <span>库存报警下限数：</span>
                            </div>
                            <div class="col-4">
                                <span id="minAmount"></span><br>
                            </div>
                            <div class="col-2" style="text-align: right">
                                <span>库存报警上限数：</span>
                            </div>
                            <div class="col-4">
                                <span id="maxAmount"></span><br>
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-2" style="text-align: right">
                                <span>配置单编号：</span>
                            </div>
                            <div class="col-4">
                                <span id="storeId"></span><br>
                            </div>
                            <div class="col-2" style="text-align: right">
<!--                                <span>设计人：</span>-->
                            </div>
                            <div class="col-4">
<!--                                <span class="designer"></span>-->
                                <br>
                            </div>
                        </div>
                    </div>
                    <br>
                <table width="80%" style="margin-top: 20px;" class="table table-sm">
                    <thead  style="background-color: #b3d7ff;">
                        <tr>
                            <th>序号</th>
                            <th>库存名称</th>
                            <th>存储地址编号</th>
                            <th>存储地址名称</th>
                            <th>最大存储量</th>
                        </tr>
                        </thead>
                        <tbody id="tbodyId">
                        </tbody>
                    </table><br>
                    <div class="container">
                        <div class="row">
                            <div class="col-2" style="text-align:right">
                                复核人：
                            </div>
                            <div class="col-4">
                                <span id="checker"></span>
                            </div>
                            <div class="col-2" style="text-align:right">
                                复核时间：
                            </div>
                            <div class="col-4">
                                <span id="checkTime"></span>
                            </div>
                        </div>
                    </div><br>
                    <span style="margin-left: 55px">配置要求：</span>
                    <div id="config" style="width: 600px;height: 100px;margin-left: 130px;border: #0b2e13 solid 1px">

                    </div>

            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

</body>
</html>